{% extends 'base.html' %}
{% load crispy_forms_tags %}

{% block title %}{{ project.name }} - 项目详情{% endblock %}

{% block content %}
<div class="container-fluid">
    <div class="row">
        <div class="col-12">
            <!-- 项目基本信息 -->
            <div class="card mb-4">
                <div class="card-header d-flex justify-content-between align-items-center">
                    <h4 class="mb-0">
                        <i class="fas fa-project-diagram me-2"></i>{{ project.name }}
                    </h4>
                    <div class="btn-group">
                        <a href="{% url 'projects:project_edit' project.pk %}" class="btn btn-warning">
                            <i class="fas fa-edit me-1"></i>编辑项目
                        </a>
                        <a href="{% url 'projects:project_list' %}" class="btn btn-secondary">
                            <i class="fas fa-arrow-left me-1"></i>返回列表
                        </a>
                    </div>
                </div>
                <div class="card-body">
                    <div class="row g-3">
                        <div class="col-md-2">
                            <div class="info-card-compact">
                                <div class="info-label">学期</div>
                                <div class="info-value">{{ project.get_semester_display_name }}</div>
                            </div>
                        </div>
                        <div class="col-md-2">
                            <div class="info-card-compact">
                                <div class="info-label">教务负责人</div>
                                <div class="info-value">{{ project.admin_manager.get_full_name|default:project.admin_manager.username }}</div>
                            </div>
                        </div>
                        <div class="col-md-2">
                            <div class="info-card-compact">
                                <div class="info-label">项目经费</div>
                                <div class="info-value text-success">¥{{ project.budget|floatformat:2 }}</div>
                            </div>
                        </div>
                        <div class="col-md-2">
                            <div class="info-card-compact">
                                <div class="info-label">子项目数量</div>
                                <div class="info-value">{{ project.subproject_count }}</div>
                            </div>
                        </div>
                        <div class="col-md-2">
                            <div class="info-card-compact">
                                <div class="info-label">立项时间</div>
                                <div class="info-value">{{ project.project_start_date|date:"Y-m-d"|default:"未设置" }}</div>
                            </div>
                        </div>
                        <div class="col-md-2">
                            <div class="info-card-compact">
                                <div class="info-label">结项时间</div>
                                <div class="info-value">{{ project.project_end_date|date:"Y-m-d"|default:"未设置" }}</div>
                            </div>
                        </div>
                    </div>
                    
                    <!-- 第二行：中期检查时间和项目描述 -->
                    <div class="row g-3 mt-2">
                        <div class="col-md-2">
                            <div class="info-card-compact">
                                <div class="info-label">中期检查时间</div>
                                <div class="info-value">{{ project.midterm_check_date|date:"Y-m-d"|default:"未设置" }}</div>
                            </div>
                        </div>
                        {% if project.description %}
                        <div class="col-md-10">
                            <div class="info-card-compact">
                                <div class="info-label">项目描述</div>
                                <div class="info-value">{{ project.description|truncatechars:100 }}</div>
                            </div>
                        </div>
                        {% endif %}
                    </div>
                </div>
            </div>

            <!-- 子项目搜索表单 -->
            <div class="card mb-4">
                <div class="card-body search-form">
                    <h6 class="card-title mb-3">
                        <i class="fas fa-search me-2 text-primary"></i>搜索子项目
                    </h6>
                    <form method="get">
                        <div class="row g-3">
                            <div class="col-md-4">
                                <label for="search" class="form-label text-muted small">子项目名称</label>
                                <input type="text" 
                                       id="search"
                                       name="search" 
                                       class="form-control" 
                                       placeholder="搜索子项目名称..."
                                       value="{{ request.GET.search|default:'' }}">
                            </div>
                            <div class="col-md-3">
                                <label for="college" class="form-label text-muted small">所属学院</label>
                                <select id="college" name="college" class="form-select">
                                    <option value="">全部学院</option>
                                    {% for college in search_form.college.field.queryset %}
                                    <option value="{{ college.pk }}" 
                                            {% if request.GET.college == college.pk|stringformat:'s' %}selected{% endif %}>
                                        {{ college.name }}
                                    </option>
                                    {% endfor %}
                                </select>
                            </div>
                            <div class="col-md-3">
                                <label for="manager" class="form-label text-muted small">负责人</label>
                                <input type="text" 
                                       id="manager"
                                       name="manager" 
                                       class="form-control" 
                                       placeholder="搜索负责人姓名..."
                                       value="{{ request.GET.manager|default:'' }}">
                            </div>
                            <div class="col-md-2 search-button-container">
                                <label class="form-label text-muted small">&nbsp;</label>
                                <div class="d-grid gap-1">
                                    <button type="submit" class="btn btn-primary text-white">
                                        <i class="fas fa-search me-1"></i>搜索
                                    </button>
                                    {% if request.GET.search or request.GET.college or request.GET.manager %}
                                    <a href="{% url 'projects:project_detail' project.pk %}" class="btn btn-outline-secondary btn-sm">
                                        <i class="fas fa-times me-1"></i>清除
                                    </a>
                                    {% endif %}
                                </div>
                            </div>
                        </div>
                    </form>
                </div>
            </div>

            <!-- 子项目列表 -->
            <div class="card">
                <div class="card-header d-flex justify-content-between align-items-center">
                    <h5 class="mb-0">
                        <i class="fas fa-tasks me-2"></i>子项目列表
                        <span class="badge bg-primary ms-2">{{ subprojects.count }}</span>
                        {% if request.GET.search or request.GET.college or request.GET.manager %}
                        <small class="text-muted ms-2">(搜索结果)</small>
                        {% endif %}
                    </h5>
                    <div class="btn-group">
                        <a href="{% url 'common:import_subprojects_page' %}?project={{ project.pk }}" class="btn btn-info btn-sm">
                            <i class="fas fa-upload me-1"></i>导入子项目数据
                        </a>
                        <a href="{% url 'subprojects:subproject_create' %}?project={{ project.pk }}" class="btn btn-success btn-sm">
                            <i class="fas fa-plus me-1"></i>添加子项目
                        </a>
                    </div>
                </div>
                <div class="card-body">
                    {% if subprojects %}
                        <div class="table-responsive">
                            <table class="table table-hover">
                                <thead class="table-light">
                                    <tr>
                                        <th>子项目名称</th>
                                        <th>负责人</th>
                                        <th>状态</th>
                                        <th>使用经费</th>
                                        <th>所属学院</th>
                                        <th>创建时间</th>
                                        <th>操作</th>
                                    </tr>
                                </thead>
                                <tbody>
                                    {% for subproject in subprojects %}
                                    <tr>
                                        <td>
                                            <a href="{% url 'subprojects:subproject_detail' subproject.pk %}" 
                                               class="text-decoration-none">
                                                {{ subproject.name }}
                                            </a>
                                        </td>
                                        <td>{{ subproject.manager }}</td>
                                        <td>
                                            <span class="badge 
                                                {% if subproject.status == 'initial' %}bg-secondary
                                                {% elif subproject.status == 'approved' %}bg-success
                                                {% elif subproject.status == 'mid_check' %}bg-info
                                                {% elif subproject.status == 'completed' %}bg-primary
                                                {% endif %}">
                                                {{ subproject.get_status_display }}
                                            </span>
                                        </td>
                                        <td>¥{{ subproject.used_budget|floatformat:2 }}</td>
                                        <td>{{ subproject.college.name }}</td>
                                        <td>{{ subproject.created_at|date:"Y-m-d H:i" }}</td>
                                        <td>
                                            <div class="btn-group btn-group-sm">
                                                <a href="{% url 'subprojects:subproject_detail' subproject.pk %}" 
                                                   class="btn btn-outline-info" title="查看详情">
                                                    <i class="fas fa-eye"></i>
                                                </a>
                                                {% if user.userprofile.role == 'admin' or subproject.college == user.userprofile.college %}
                                                <a href="{% url 'subprojects:subproject_edit' subproject.pk %}" 
                                                   class="btn btn-outline-warning" title="编辑">
                                                    <i class="fas fa-edit"></i>
                                                </a>
                                                {% endif %}
                                            </div>
                                        </td>
                                    </tr>
                                    {% endfor %}
                                </tbody>
                            </table>
                        </div>
                    {% else %}
                        <div class="text-center py-4">
                            <i class="fas fa-tasks fa-3x text-muted mb-3"></i>
                            <h6 class="text-muted">暂无子项目</h6>
                            <p class="text-muted">点击上方按钮添加第一个子项目</p>
                        </div>
                    {% endif %}
                </div>
            </div>
        </div>
    </div>
</div>

{% endblock %}